<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<script>
  window.onload=function (ev) {

  };
  // 显示图片路径
  function hh() {
    alert(document.getElementById("fruit").getAttribute("src"));
  }
  // 喜欢的水果
  function check() {
    var allenjoy = document.getElementsByName("enjoy");
    var allchecked="";
    for(var i =0;i<allenjoy.length;i++){
      if(allenjoy[i].checked==true){
        // alert(allenjoy[i].getAttribute("value"));
        allchecked+=allenjoy[i].getAttribute("value")+'\n';
      }
    }
    alert(allchecked);
  }
  // 改变图片
  function change() {
    // 把谁替换:
    var a = document.getElementById("fruit");
    // 替换的内容:
    document.getElementById("fruit").setAttribute("src","../../img/4.25/grape.jpg");
    /*var newimg=document.createElement("img");
    newimg.src="../../img/4.25/grape.jpg";
    document.body.replaceChild(newimg,a);*/
  }
</script>
<img src="../../img/4.25/fruit.jpg" alt="水果图片" id="fruit" />
<h1 id="love">选择你喜欢的水果：</h1>
<input name="enjoy" type="checkbox" value="apple" id="a" /><label for="a">苹果</label>
<input name="enjoy" type="checkbox" value="banana" />香蕉
<input name="enjoy" type="checkbox" value="grape" />葡萄
<input name="enjoy" type="checkbox" value="pear" />梨
<input name="enjoy" type="checkbox" value="watermelon" />西瓜
<br />
<input name="btn" type="button" value="显示图片路径" onclick="hh()" />
<br /><input name="btn" type="button" value="喜欢的水果" onclick="check()" />
<br /><input name="btn" type="button" value="改变图片" onclick="change()" />
</body>
</html>
